<!DOCTYPE html>
<html>
	<head>
	</head>
	<body>
		<div id="convitePlayer" style="float: left;">
			<p id='mensagens' style="display: none;"></p>
			
			<div class="areaCampos" id="convidarPlayer" style="width: 270px;">
				<h2>Convide um Player</h2>
				<p>	
					<label>E-mail:</label>
					<input id='email' data-bind="value: email"/>
				</p>
				<p>
					<label>Time:</label>
					<select data-bind="options: times, optionsText: 'nome', value: timeSelecionado"></select>
				</p>
				<button data-bind='click: cadastrarConviteParticiparTime'>Convidar</button>
			</div>
		</div>
		<div id="convites" style="float: right; width: 700px; display:none;">
			<p id='mensagens' style="display: none;"></p>
			<div class="areaCampos" style="width: 500px;">
				<table>
				    <thead>
				        <tr><th>Convites Pendentes</th></tr>
				    </thead>
				    <tbody data-bind="foreach: convites">
				        <tr">
				            <td data-bind="text: mensagem"></td>
				            <td><button data-bind='click: aceitar'>Aceitar</button><td>
				            <td><button data-bind='click: recusar'>Recusar</button><td>
				        </tr>
				    </tbody>
				</table>
			</div>
		</div>
	</body>
	<script>
			var cadastroConvite = new CadastroConvite();
			var convitePendente = new ConvitePendente();
			
			var user = $.parseJSON(localStorage.user);
			
			var requestTimes = $.ajax({ type: 'GET', dataType : 'html', url: 'http://localhost:8080/players/cadastro/time/buscar/todos/capitao', data: {capitao: user.apelido}});
			
			requestTimes.done( function (callback) {
				if (callback) {
					var jsontimes = $.parseJSON(callback);
					
					for(var i = 0; i < jsontimes.length; i++) {
						cadastroConvite.self.times.push(jsontimes[i]);
					}
				} 	
			});
			
			function carregarConvites() {
				var requestConvites = $.ajax({ type: 'GET', dataType : 'html', url: 'http://localhost:8080/players/cadastro/convite/buscar/convites/player', data: {id: user.id}});
				
				requestConvites.done( function (callback) {
					if (callback) {
						var jsonConvites = $.parseJSON(callback);
						convitePendente.self.convites.removeAll();
						
						if( !$('#convites').is(':visible') && jsonConvites.length > 0) {
							$('#convites').toggle();
						}
						
						if( $('#convites').is(':visible') && jsonConvites.length == 0) {
							$('#convites').toggle();
						}
						
						for(var i = 0; i < jsonConvites.length; i++) {
							convitePendente.self.convites.push(jsonConvites[i]);
						}
					} 
				});
			}
			
			function CadastroConvite() {
				this.self = this;
				
				self.email = ko.observable('');
				this.times = ko.observableArray();
				self.timeSelecionado = ko.observable();
				
				self.cadastrarConviteParticiparTime = function() {
					var user = $.parseJSON(localStorage.user);
					var request = $.ajax({ type: 'POST', dataType : 'html', url: 'http://localhost:8080/players/cadastro/convite/conviteParticiparTime', data: {email: self.email, idTime: self.timeSelecionado().id }});
					request.done( function (callback) {
	        			if (callback == "-1") {
	        				$('#convitePlayer').children("#mensagens").fadeIn(2000);
		        			$('#convitePlayer').children("#mensagens").text('O player convidado nao existe.');
		        			$('#convitePlayer').children("#mensagens").fadeOut(3000);
	        			} else if (callback == "0") {
	        				$('#convitePlayer').fadeIn(2000);
		        			$('#convitePlayer').text('Nao foi possivel encontrar o time selecionado.');
		        			$('#convitePlayer').fadeOut(3000);
	        			} else {
	        				carregarConvites();
	        				$('#convitePlayer').children("#mensagens").fadeIn(2000);
		        			$('#convitePlayer').children("#mensagens").text('Convite enviado com sucesso.');
		        			$('#convitePlayer').children("#mensagens").fadeOut(3000);
	        			}
	        		});
					
					self.email("");
				};
				
		    }
			
			ko.applyBindings(cadastroConvite, document.getElementById("convitePlayer"));
			
			var requestConvites = $.ajax({ type: 'GET', dataType : 'html', url: 'http://localhost:8080/players/cadastro/convite/buscar/convites/player', data: {id: user.id}});
			
			requestConvites.done( function (callback) {
				if (callback) {
					var jsonConvites = $.parseJSON(callback);
					
					if(jsonConvites.length > 0) {
						$('#convites').toggle();
					}
					
					for(var i = 0; i < jsonConvites.length; i++) {
						convitePendente.self.convites.push(jsonConvites[i]);
					}
				} 
			});
			
			function ConvitePendente() {
				this.self = this;
				
				this.convites = ko.observableArray();
				
				self.aceitar = function() {
					var convite = this;
					var request = $.ajax({ type: 'POST', dataType : 'html', url: 'http://localhost:8080/players/cadastro/convite/inserir/player/time', data: {idTime: convite.idTime, idPlayer: convite.idPlayer, idConvite: convite.id}});
					
					request.done( function (callback) {
						if (callback == "1") {
							$('#convitePlayer').children("#mensagens").fadeIn(2000);
							$('#convitePlayer').children("#mensagens").text('Convite aceito.');
							$('#convitePlayer').children("#mensagens").fadeOut(3000);
							convitePendente.self.convites.remove(convite);
							carregarConvites();
	        			} else if (callback == "0") {
	        				$('#convitePlayer').children("#mensagens").fadeIn(2000);
	        				$('#convitePlayer').children("#mensagens").text('Nao foi possivel encontrar este convite.');
	        				$('#convitePlayer').children("#mensagens").fadeOut(3000);
	        			}
					});
				}
				
				self.recusar = function() {
					var convite = this;
					var request = $.ajax({ type: 'POST', dataType : 'html', url: 'http://localhost:8080/players/cadastro/convite/remover/convite', data: {idConvite: convite.id}});
					
					request.done( function (callback) {
						if (callback == "1") {
							$('#convitePlayer').children("#mensagens").fadeIn(3000);
							$('#convitePlayer').children("#mensagens").text('Convite recusado.');
							$('#convitePlayer').children("#mensagens").fadeOut(3000);
							convitePendente.self.convites.remove(convite);
							carregarConvites();
	        			} else if (callback == "0") {
	        				$('#convitePlayer').children("#mensagens").fadeIn(3000);
	        				$('#convitePlayer').children("#mensagens").text('Nao foi possivel encontrar este convite.');
	        				$('#convitePlayer').children("#mensagens").fadeOut(3000);
	        			}
					});
				}
			}
			
			ko.applyBindings(convitePendente, document.getElementById("convites"));
	</script>
</html>